<template>
	<el-drawer :title="titleMap[mode]" v-model="visible" :size="700" destroy-on-close @closed="$emit('closed')">
		<el-form :model="form" :rules="rules" :disabled="mode=='show'" ref="dialogForm" style="padding-left: 20px;padding-right: 20px;">
			<h3>基础配置</h3><br/>
			<el-form-item label="商户名称" prop="merchantName">
				<el-input v-model="form.merchantName" clearable></el-input>
			</el-form-item>
			<el-form-item label="商户类型" prop="merchantType">
				<el-select v-model="form.merchantType" placeholder="请选择">
					<el-option
					v-for="item in merchantTypeOptions"
					:key="item.value"
					:label="item.label"
					:value="item.value">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="支付结果通知URL" prop="payNotifyUrl">
				<el-input v-model="form.payNotifyUrl" clearable type="textarea"></el-input>
			</el-form-item>
			<el-form-item label="退款结果通知URL" prop="refundNotifyUrl">
				<el-input v-model="form.refundNotifyUrl" clearable type="textarea"></el-input>
			</el-form-item>
			<el-form-item label="是否返回服务商单号" prop="toMerchantTradeNo">
				<el-radio-group v-model="form.toMerchantTradeNo">
					<el-radio label="0" size="large">否</el-radio>
					<el-radio label="1" size="large">是</el-radio>
				</el-radio-group>
			</el-form-item>
			<h3>支付配置</h3><br/>
			<el-form :model="form.alipayProperties" v-if="form.merchantType==10" :rules="alipayRules" :disabled="mode=='show'" ref="alipayPropertiesDialogForm" label-width="100px" label-position="left">
				<el-form-item label="商户号" prop="merchantNo">
					<el-input v-model="form.alipayProperties.merchantNo" clearable></el-input>
				</el-form-item>
				<el-form-item label="应用ID" prop="appId">
					<el-input v-model="form.alipayProperties.appId" clearable></el-input>
				</el-form-item>
				<el-form-item label="应用公钥" prop="appPublicKey">
					<el-input v-model="form.alipayProperties.appPublicKey" clearable type="textarea"></el-input>
				</el-form-item>
				<el-form-item label="应用私钥" prop="appPrivateKey">
					<el-input v-model="form.alipayProperties.appPrivateKey" clearable type="textarea"></el-input>
				</el-form-item>
				<el-form-item label="支付宝公钥" prop="alipayPublicKey">
					<el-input v-model="form.alipayProperties.alipayPublicKey" clearable type="textarea"></el-input>
				</el-form-item>
				<el-form-item label="支付宝网关" prop="serverUrl">
					<el-input v-model="form.alipayProperties.serverUrl" clearable></el-input>
				</el-form-item>
				<el-form-item label="是否正式环境" prop="prodEnv">
					<el-radio-group v-model="form.alipayProperties.prodEnv">
						<el-radio label="0" size="large">否</el-radio>
						<el-radio label="1" size="large">是</el-radio>
					</el-radio-group>
				</el-form-item>
			</el-form>
			<el-form :model="form.wechatPayProperties" v-if="form.merchantType==20" :rules="wechatPayRules" :disabled="mode=='show'" ref="wechatPayPropertiesDialogForm" label-width="125px" label-position="left">
				<el-form-item label="商户号" prop="mchId">
					<el-input v-model="form.wechatPayProperties.mchId" clearable></el-input>
				</el-form-item>
				<el-form-item label="应用ID" prop="appId">
					<el-input v-model="form.wechatPayProperties.appId" clearable></el-input>
				</el-form-item>
				<el-form-item label="商户证书序列号" prop="mchSerialNo">
					<el-input v-model="form.wechatPayProperties.mchSerialNo" clearable></el-input>
				</el-form-item>
				<el-form-item label="平台证书序列号" prop="wechatPaySerial">
					<el-input v-model="form.wechatPayProperties.wechatPaySerial" clearable></el-input>
				</el-form-item>
				<el-form-item label="商户私钥" prop="privateKey">
					<el-input v-model="form.wechatPayProperties.privateKey" clearable></el-input>
				</el-form-item>
				<el-form-item label="apiV3密钥" prop="v3Secret">
					<el-input v-model="form.wechatPayProperties.v3Secret" clearable></el-input>
				</el-form-item>
				<el-form-item label="apiV2密钥" prop="v2Secret">
					<el-input v-model="form.wechatPayProperties.v2Secret" clearable></el-input>
				</el-form-item>
				<el-form-item label="证书值" prop="certp12">
					<el-input type="textarea" placeholder="通过hex解析为16进制存，只有接口版本是v2，付款码支付用到" v-model="form.wechatPayProperties.certp12" clearable></el-input>
				</el-form-item>
				<el-form-item label="接口地址" prop="url">
					<el-input v-model="form.wechatPayProperties.url" clearable></el-input>
				</el-form-item>
			</el-form>
			<el-form :model="form.unionPayProperties" v-if="form.merchantType==30" :rules="unionPayRules" :disabled="mode=='show'" ref="unionPayPropertiesDialogForm" label-width="110px" label-position="left">
				<el-form-item label="商户号" prop="merchantNo">
					<el-input v-model="form.unionPayProperties.merchantNo" clearable></el-input>
				</el-form-item>
				<el-form-item label="服务地址" prop="serviceUrl">
					<el-input v-model="form.unionPayProperties.serviceUrl" clearable></el-input>
				</el-form-item>
				<el-form-item label="签名证书路径" prop="signCertPath">
					<el-input v-model="form.unionPayProperties.signCertPath" clearable></el-input>
				</el-form-item>
				<el-form-item label="签名证书密码" prop="signCertPwd">
					<el-input v-model="form.unionPayProperties.signCertPwd" clearable></el-input>
				</el-form-item>
				<el-form-item label="验签证书路径" prop="validateCertPath">
					<el-input v-model="form.unionPayProperties.validateCertPath" clearable></el-input>
				</el-form-item>
			</el-form>
		</el-form>
		<template #footer>
			<el-button @click="visible=false" >取 消</el-button>
			<el-button v-if="mode!='show'" type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
		</template>
	</el-drawer>
</template>

<script>
	export default {
		emits: ['success', 'closed'],
		data() {
			return {
				mode: "add",
				titleMap: {
					add: '新增',
					edit: '编辑',
					show: '查看'
				},
				visible: false,
				isSaveing: false,
				//表单数据
				form: {
					id:null,
					merchantName: "",
					merchantType: "10",
					payNotifyUrl: "",
					refundNotifyUrl: "",
					toMerchantTradeNo: "0",
					alipayProperties: {
						merchantNo: "",
						appId: "",
						appPublicKey: "",
						appPrivateKey: "",
						alipayPublicKey: "",
						serverUrl: "",
						prodEnv: "0"
					},
					unionPayProperties: {
						merchantNo: "",
						serviceUrl: "",
						signCertPath: "",
						signCertPwd: "",
						validateCertPath: ""
					},
					wechatPayProperties: {
						url: "",
						mchId: "",
						appId: "",
						mchSerialNo: "",
						wechatPaySerial: "",
						privateKey: "",
						v3Secret: "",
						v2Secret: "",
						certp12: ""
					}
				},
				//验证规则
				rules: {
					merchantName: [
						{required: true, message: '请输入商户名称'}
					],
					merchantType: [
						{required: true, message: '请选择商户类型'}
					]
				},
				alipayRules: {
					merchantNo: [
						{required: true, message: '请输入商户号'}
					],
					appId: [
						{required: true, message: '请输入应用ID'}
					],
					appPublicKey: [
						{required: true, message: '请输入应用公钥'}
					],
					appPrivateKey: [
						{required: true, message: '请输入应用私钥'}
					],
					alipayPublicKey: [
						{required: true, message: '请输入支付宝公钥'}
					],
					serverUrl: [
						{required: true, message: '请输入支付宝网关'}
					]
				},
				wechatPayRules: {
					url: [
						{required: true, message: '请输入接口地址'}
					],
					mchId: [
						{required: true, message: '请输入商户号'}
					],
					appId: [
						{required: true, message: '请输入应用ID'}
					],
					mchSerialNo: [
						{required: true, message: '请输入商户证书序列号'}
					],
					wechatPaySerial: [
						{required: true, message: '请输入平台证书序列号'}
					],
					privateKey: [
						{required: true, message: '请输入商户私钥'}
					],
					v3Secret: [
						{required: true, message: '请输入apiV3密钥'}
					],
					v2Secret: [
						{required: true, message: '请输入apiV2密钥'}
					],
					certp12: [
						{required: true, message: '请输入证书值'}
					]
				},
				unionPayRules: {
					merchantNo: [
						{required: true, message: '请输入商户号'}
					],
					serviceUrl: [
						{required: true, message: '请输入服务地址'}
					],
					signCertPath: [
						{required: true, message: '请输入签名证书路径'}
					],
					signCertPwd: [
						{required: true, message: '请输入签名证书密码'}
					]
				},
				merchantTypeOptions: [
					{
						value: '10',
						label: '支付宝'
					}, {
						value: '20',
						label: '微信'
					}, {
						value: '30',
						label: '银联'
					}
				]
			}
		},
		mounted() {

		},
		methods: {
			//显示
			open(mode='add'){
				this.mode = mode;
				this.visible = true;
				return this
			},
			//表单提交方法
			submit(){
				this.$refs.dialogForm.validate(async (valid) => {
					if (valid) {
						this.isSaveing = true;
						var data = this.form;
						data.toMerchantTradeNo = data.toMerchantTradeNo == 0 ? false : true;
						if(data.merchantType==10){
							data.alipayProperties.prodEnv = data.alipayProperties.prodEnv == 0 ? false : true;
							data.wechatPayProperties = null;
							data.unionPayProperties = null;
						}else if(data.merchantType==20){
							data.alipayProperties = null;
							data.unionPayProperties = null;
						}else if(data.merchantType==30){
							data.alipayProperties = null;
							data.wechatPayProperties = null;
						}
						var res = await this.$API.merchant.save.post(data);
						this.isSaveing = false;
						if(res.code == 0){
							this.$emit('success', this.form, this.mode)
							this.visible = false;
							this.$message.success("操作成功")
						}else{
							this.$alert(res.message, "提示", {type: 'error'})
						}
					}
				})
			},
			//表单注入数据
			setData(data){
				data.toMerchantTradeNo = data.toMerchantTradeNo == true ? '1' : '0';
				if(data.merchantType==10){
					data.alipayProperties.prodEnv = data.alipayProperties.prodEnv == true ? '1' : '0';
					data.wechatPayProperties = {
						url: "",
						mchId: "",
						appId: "",
						mchSerialNo: "",
						wechatPaySerial: "",
						privateKey: "",
						v3Secret: "",
						v2Secret: "",
						certp12: ""
					};
					data.unionPayProperties = {
						merchantNo: "",
						serviceUrl: "",
						signCertPath: "",
						signCertPwd: "",
						validateCertPath: ""
					};
				}else if(data.merchantType==20){
					data.alipayProperties = {
						merchantNo: "",
						appId: "",
						appPublicKey: "",
						appPrivateKey: "",
						alipayPublicKey: "",
						serverUrl: "",
						prodEnv: "0"
					};
					data.unionPayProperties = {
						merchantNo: "",
						serviceUrl: "",
						signCertPath: "",
						signCertPwd: "",
						validateCertPath: ""
					};
				}else if(data.merchantType==30){
					data.alipayProperties = {
						merchantNo: "",
						appId: "",
						appPublicKey: "",
						appPrivateKey: "",
						alipayPublicKey: "",
						serverUrl: "",
						prodEnv: "0"
					};
					data.wechatPayProperties = {
						url: "",
						mchId: "",
						appId: "",
						mchSerialNo: "",
						wechatPaySerial: "",
						privateKey: "",
						v3Secret: "",
						v2Secret: "",
						certp12: ""
					};
				}
				// this.form.id = data.id
				// this.form.label = data.label
				// this.form.alias = data.alias
				// this.form.sort = data.sort
				// this.form.status = data.status
				// this.form.remark = data.remark

				//可以和上面一样单个注入，也可以像下面一样直接合并进去
				Object.assign(this.form, data)
			}
		}
	}
</script>

<style>
</style>
